<%--
Document : index
Created on : 28 mai 2011, 18:55:36
Author : Roman
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <link rel="stylesheet" href="css/style.css" type="text/css"/>
        <title>Gestion de BD</title>
    </head>
    <body onload="javascript:ajaxGetBds()">
        <div id="container">
            <div id="topleft">
                <img src="images/miage.jpg" alt="Restful DB tool" />
            </div>
            <div id="topright">
            </div>
            <div id="topmenu">
                Base de donnée : <select id="selectBDD" onchange="javascript:ajaxGetTables()"></select>
                Table : <select id="selectTable" onchange="javascript:ajaxGetChamps()"></select>
            </div>
            <div id="middle">
                Veuillez selectionner une base de données et une table pour afficher ses lignes.
            </div>
            <div id="bottom">
            </div>
        </div>

        <script type="text/javascript">
            var rowsG = null;
            
            function ajaxGetBds() {
                // Instancier un appel Ajax
                var appel = new XMLHttpRequest();
                // Indiquer l'URL et la méthode
                appel.open("GET", "/ProjetXMLRestMyAdmin/ProxyAction?url=http://localhost:8182/bds", true);
                // Indiquer la reaction lors de l'arrivee de la reponse
                appel.onreadystatechange = function() {
                    if (appel.readyState == 4) {
                        // reponse arrivee
                        if (appel.status == 200) {
                            // Ca s'est bien passe
                            var doc = appel.responseXML;
                            if (doc != null) {
                                var databases = doc.getElementsByTagName("database");
                                var select = document.getElementById("selectBDD");

                                while (select.firstChild) {
                                    select.removeChild(select.firstChild);
                                }

                                for (i = 0; i < databases.length; ++i) {
                                    var option = document.createElement("option");
                                    option.innerHTML = databases[i].firstChild.nodeValue;
                                    option.setAttribute("value", databases[i]);
                                    select.appendChild(option);
                                }
                                select.selectedIndex = -1;
                            }
                        }
                        else {
                            zone.innerHTML = "Oups ! Pb avec serveur : " + appel.status;
                        }
                    }
                }
                // Envoyer la requete
                appel.send("");
            }

            function ajaxGetTables() {
                // Instancier un appel Ajax
                var appel = new XMLHttpRequest();
                // Indiquer l'URL et la méthode
                var bddIndex = document.getElementById("selectBDD").selectedIndex;
                var bdd = document.getElementById("selectBDD").childNodes[bddIndex].text;
                appel.open("GET", "/ProjetXMLRestMyAdmin/ProxyAction?url=http://localhost:8182/bds/" + bdd, true);
                // Indiquer la reaction lors de l'arrivee de la reponse
                appel.onreadystatechange = function() {
                    if (appel.readyState == 4) {
                        // reponse arrivee
                        if (appel.status == 200) {
                            // Ca s'est bien passe
                            var doc = appel.responseXML;
                            if (doc != null) {
                                var tables = doc.getElementsByTagName("table");
                                var select = document.getElementById("selectTable");
                                
                                while (select.firstChild) {
                                    select.removeChild(select.firstChild);
                                }

                                for (i = 0; i < tables.length; ++i) {
                                    var option = document.createElement("option");
                                    option.innerHTML = tables[i].firstChild.nodeValue;
                                    option.setAttribute("value", tables[i]);
                                    select.appendChild(option);
                                }
                                select.selectedIndex = -1;
                            }
                        }
                        else {
                            zone.innerHTML = "Oups ! Pb avec serveur : " + appel.status;
                        }
                    }
                }
                // Envoyer la requete
                appel.send("");
            }

            function ajaxGetChamps() {
                // Instancier un appel Ajax
                var appel = new XMLHttpRequest();
                // Indiquer l'URL et la méthode
                var bddIndex = document.getElementById("selectBDD").selectedIndex;
                var bdd = document.getElementById("selectBDD").childNodes[bddIndex].text;
                var tableIndex = document.getElementById("selectTable").selectedIndex;
                var table = document.getElementById("selectTable").childNodes[tableIndex].text;
                
                appel.open("GET", "/ProjetXMLRestMyAdmin/ProxyAction?url=http://localhost:8182/bds/"
                    + bdd + "/" + table, true);
                // Indiquer la reaction lors de l'arrivee de la reponse
                appel.onreadystatechange = function() {
                    if (appel.readyState == 4) {
                        // reponse arrivee
                        var zone = document.getElementById("middle");
                        if (appel.status == 200) {
                            // Ca s'est bien passe
                            var doc = appel.responseXML;
                            if (doc != null) {
                                clearData();
                                var table = document.createElement("table");
                                table.setAttribute("class", "data");
                                var structure = doc.getElementsByTagName("structure")[0];
                                var trStruct = document.createElement("tr");
                                
                                for (k = 0; k < structure.childNodes.length; ++k) {
                                    var column = structure.childNodes[k];
                                    var th = document.createElement("th");
                                    th.innerHTML = column.getAttribute("name");
                                    th.setAttribute("type", column.getAttribute("type"));
                                    th.setAttribute("javaClass", column.getAttribute("class"));
                                    trStruct.appendChild(th);
                                }
                                table.appendChild(trStruct);
                                var rows = doc.getElementsByTagName("row");
                                rowsG = rows;
                                for (i = 0; i < rows.length; ++i) {
                                    var tr = document.createElement("tr");
                                    var row = rows[i];
                                    for (j = 0; j < row.childNodes.length; ++j) {
                                        var field = row.childNodes[j];
                                        var td = document.createElement("td");

                                        var input = document.createElement("input");

                                        input.setAttribute("id", i + field.getAttribute("name"));
                                        input.setAttribute("type", "text");
                                        input.setAttribute("value", field.firstChild.nodeValue);

                                        td.appendChild(input);
                                        tr.appendChild(td);
                                    }
                                    table.appendChild(tr);
                                }

                                // Row d'ajout d'une ligne
                                var trAdd = document.createElement("tr");
                                for (j = 0; j < structure.childNodes.length; ++j) {
                                    var column = structure.childNodes[j];
                                    var td = document.createElement("td");
                                    var input = document.createElement("input");
                                    input.setAttribute("id", "new" + column.getAttribute("name"));
                                    input.setAttribute("type", "text");
                                    input.setAttribute("defaultValue", column.getAttribute("name"));
                                    td.appendChild(input);
                                    trAdd.appendChild(td);
                                }
                                table.appendChild(trAdd);

                                // Colonne d'actions
                                // Début à j = 1 pour éviter le haut du tableau
                                // Traitement spécial pour la dernière ligne d'ajout
                                for (j = 1; j < table.childNodes.length; ++j) {
                                    var td = document.createElement("td");

                                    if (j < table.childNodes.length - 1) {
                                        var buttonMod = document.createElement("input");
                                        buttonMod.setAttribute("type", "submit");
                                        buttonMod.setAttribute("value", "Modifier");
                                        buttonMod.setAttribute("id", "modRow");
                                        buttonMod.setAttribute("onClick", "modRow(" + (j - 1) + ")");
                                        var buttonDel = document.createElement("input");
                                        buttonDel.setAttribute("type", "submit");
                                        buttonDel.setAttribute("value", "Supprimer");
                                        buttonDel.setAttribute("id", "delRow");
                                        buttonDel.setAttribute("onClick", "delRow(" + (j - 1) + ")");
                                        td.appendChild(buttonMod);
                                        td.appendChild(buttonDel);
                                    }
                                    else {
                                        var buttonAdd = document.createElement("input");
                                        buttonAdd.setAttribute("type", "submit");
                                        buttonAdd.setAttribute("value", "Ajouter");
                                        buttonAdd.setAttribute("id", "addRow");
                                        buttonAdd.setAttribute("onClick", "addRow(" + (j - 1) + ")");
                                        td.appendChild(buttonAdd);
                                    }
                                    
                                    table.childNodes[j].appendChild(td);
                                }

                                zone.appendChild(table);
                            }
                        }
                        else {
                            zone.innerHTML = "Oups ! Pb avec serveur : " + appel.status;
                        }
                    }
                }
                // Envoyer la requete
                appel.send("");
            }

            function modRow(j) {
                var selectedRow = rowsG[j];

                // Instancier un appel Ajax
                var appel = new XMLHttpRequest();
                // Indiquer l'URL et la méthode
                var bddIndex = document.getElementById("selectBDD").selectedIndex;
                var bdd = document.getElementById("selectBDD").childNodes[bddIndex].text;
                var tableIndex = document.getElementById("selectTable").selectedIndex;
                var tableName = document.getElementById("selectTable").childNodes[tableIndex].text;

                var representation = document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'xml', null);
                var database = representation.createElement("database");
                database.setAttribute("name", bdd);
                var table = representation.createElement("table");
                table.setAttribute("name", tableName);
                database.appendChild(table);
                var toModify = representation.createElement("toModify");
                table.appendChild(toModify);

                for (i = 0; i < selectedRow.childNodes.length; ++i) {
                    var field = representation.createElement("field");
                    var name = selectedRow.childNodes[i].getAttribute("name");
                    var value = selectedRow.childNodes[i].firstChild.nodeValue;
                    var newValue = document.getElementById(j + name).value;
                    field.setAttribute("name", name);
                    field.setAttribute("oldValue", value);
                    field.appendChild(representation.createTextNode(newValue));
                    toModify.appendChild(field);
                }

                representation.documentElement.appendChild(database);

                appel.open("PUT", "/ProjetXMLRestMyAdmin/ProxyAction?url=http://localhost:8182/bds/"
                    + bdd + "/" + tableName + "/" + (j + 1), true);
                appel.send(representation);
                // Indiquer la reaction lors de l'arrivee de la reponse
                appel.onreadystatechange = function() {
                    if (appel.readyState == 4) {
                        // reponse arrivee
                        if (appel.status == 200) {
                            // Ca s'est bien passe
                            ajaxGetChamps();
                        }
                    }
                }
            }

            function delRow(j) {
                var selectedRow = rowsG[j];

                // Instancier un appel Ajax
                var appel = new XMLHttpRequest();
                // Indiquer l'URL et la méthode
                var bddIndex = document.getElementById("selectBDD").selectedIndex;
                var bdd = document.getElementById("selectBDD").childNodes[bddIndex].text;
                var tableIndex = document.getElementById("selectTable").selectedIndex;
                var tableName = document.getElementById("selectTable").childNodes[tableIndex].text;

                var representation = document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'xml', null);
                var database = representation.createElement("database");
                database.setAttribute("name", bdd);
                var table = representation.createElement("table");
                table.setAttribute("name", tableName);
                database.appendChild(table);
                var toDelete = representation.createElement("toDelete");
                table.appendChild(toDelete);

                for (i = 0; i < selectedRow.childNodes.length; ++i) {
                    var field = representation.createElement("field");
                    var name = selectedRow.childNodes[i].getAttribute("name");
                    var value = selectedRow.childNodes[i].firstChild.nodeValue;
                    field.setAttribute("name", name);
                    field.appendChild(representation.createTextNode(value));
                    toDelete.appendChild(field);
                }

                representation.documentElement.appendChild(database);

                appel.open("DELETE", "/ProjetXMLRestMyAdmin/ProxyAction?url=http://localhost:8182/bds/"
                    + bdd + "/" + tableName + "/" + (j + 1), true);
                appel.send(representation);
                // Indiquer la reaction lors de l'arrivee de la reponse
                appel.onreadystatechange = function() {
                    if (appel.readyState == 4) {
                        // reponse arrivee
                        if (appel.status == 200) {
                            // Ca s'est bien passe
                            ajaxGetChamps();
                        }
                    }
                }
            }

            function addRow(j) {
                var selectedRow = rowsG[0];

                // Instancier un appel Ajax
                var appel = new XMLHttpRequest();
                // Indiquer l'URL et la méthode
                var bddIndex = document.getElementById("selectBDD").selectedIndex;
                var bdd = document.getElementById("selectBDD").childNodes[bddIndex].text;
                var tableIndex = document.getElementById("selectTable").selectedIndex;
                var tableName = document.getElementById("selectTable").childNodes[tableIndex].text;

                var representation = document.implementation.createDocument('http://www.w3.org/1999/xhtml', 'xml', null);
                var database = representation.createElement("database");
                database.setAttribute("name", bdd);
                var table = representation.createElement("table");
                table.setAttribute("name", tableName);
                database.appendChild(table);
                var toAdd = representation.createElement("toAdd");
                table.appendChild(toAdd);

                for (i = 0; i < selectedRow.childNodes.length; ++i) {
                    var field = representation.createElement("field");
                    var name = selectedRow.childNodes[i].getAttribute("name");
                    var newValue = document.getElementById("new" + name).value;
                    field.setAttribute("name", name);
                    field.appendChild(representation.createTextNode(newValue));
                    toAdd.appendChild(field);
                }

                representation.documentElement.appendChild(database);

                appel.open("POST", "/ProjetXMLRestMyAdmin/ProxyAction?url=http://localhost:8182/bds/"
                    + bdd + "/" + tableName, true);
                appel.send(representation);
                // Indiquer la reaction lors de l'arrivee de la reponse
                appel.onreadystatechange = function() {
                    if (appel.readyState == 4) {
                        // reponse arrivee
                        if (appel.status == 200) {
                            // Ca s'est bien passe
                            ajaxGetChamps();
                        }
                    }
                }
            }

            function clearData() {
                var zone = document.getElementById("middle");
                while (child = zone.firstChild)
                    zone.removeChild(child);
            }
        </script>
    </body>
</html>

